import { Button } from 'antd';
import { useState } from 'react';

interface TagButtonProps {
  children: React.ReactNode;
  select: () => void;
  cancel: () => void;
}

const TagButton: React.FC<TagButtonProps> = ({ children, select, cancel }) => {
  const [isClick, setClick] = useState<boolean>(false);

  const onClick = () => {
    if (isClick) cancel();
    else select();
    setClick(!isClick);
  };

  return (
    <Button type={isClick ? 'primary' : 'default'} onClick={onClick}>
      {children}
    </Button>
  );
};

export default TagButton;
